<?php $this->load->view('_inc/header'); ?>
<script>
    var ok = 0;
    var pouca = 0;
    var muita = 0;
    var reprovado = 0;
    
    $(document).ready(function(){
       // ------------- DADOS PARA OS GRAFICOS -------------------------- 
       $('.listagem > tbody > tr > .situacao').each(function(){
           var texto = $(this).text();
           switch(texto){
               case 'OK': ok++; break;
               case 'Poucas faltas': pouca++; break;
               case 'Muitas faltas': muita++; break;
               case 'Reprovado': reprovado++; break;
           }
       });
        
       // --------- Esconder e mostrar --------------------
       $('#opGraf2').css({'font-size':'12px'});
       $('.esconde').hide();
       $('#graf2').hide();
       
       $('#opGraf1').click(function(){
          var tam = $(this).css('font-size');
          $('#opGraf2').css({'font-size':'12px'});
          $(this).css({'font-size':'18px'});
          $('#graf2').slideUp(600);
          $('#graf1').slideDown(600);
       });
       
       $('#opGraf2').click(function(){
          $('#opGraf1').css({'font-size':'12px'}); 
          $(this).css({'font-size':'18px'});
          $('#graf1').slideUp(600);
          $('#graf2').slideDown(600);
       }); 
       
       $('.tituloTog').click(function(){
          $(this).next('.esconde').slideToggle(600); 
       });
       // -----------------------------------------------------
       
       // ------------ Edição e exclusão ----------------------
       $('.editar').click(function(){
            var id = $(this).attr('id');
            var divEditar = $('.popUp');
            $.ajax({
                url: '<?php echo base_url()?>index.php/turma/editarAula/' + id,
                type: 'POST',
                success: function(data){
                    divEditar.html(data);
                    abrePopUp();
                }
            });
       });
       
       $('.excluir').click(function(){      
            if(confirm("Deseja realmente excluir esta turma?")){
                var id = $(this).attr('id');
                $(this).parent('td').parent('tr').css('background','#ff9999').hide(600);
                $.ajax({
                    url: '<?php echo base_url()?>index.php/turma/excluirAula/' + id,
                    type: 'POST',
                });
            }
        });
    });
    
    // -------------- GRAFICOS --------------------------------------------------
    google.load('visualization', '1.0', {'packages':['corechart']});
    google.setOnLoadCallback(drawChart);
    function drawChart() {

        // Create the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Situações');
        data.addColumn('number', 'Número');
        data.addRows([
          ['Presente', 3],
          ['Saiu mais cedo', 1],
          ['Atrasado', 1],
          ['Falta', 1],
        ]);
        
        // Set chart options
        var options = {
            'width':645,
            'height':300,
            'colors': ['#29ff49', '#37e8df', '#d9f53b', '#ff6347'],
            'backgroundColor': 'transparent',
            'is3D': true 
        };

        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.PieChart(document.getElementById('graf1'));
        chart.draw(data, options);
      }
      
      google.setOnLoadCallback(drawChart2);
      function drawChart2() {

        // Create the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Situações');
        data.addColumn('number', 'Número');
        data.addRows([
          ['OK (até 5%)', ok],
          ['Poucas faltas (de 5 a 15%)', pouca],
          ['Muitas faltas (de 15% a 25%)', muita],
          ['Reprovado (maior que 25%)', reprovado],
        ]);
        
        // Set chart options
        var options = {
            'width':645,
            'height':300,
            'colors': ['#29ff49','#d9f53b','#ff6347','#1a1a1a'],
            'backgroundColor': 'transparent',
            'is3D': true
        };

        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.PieChart(document.getElementById('graf2'));
        chart.draw(data, options);
      }
</script>

<table style="width:100%">
    <tr>
        <td valign="top" style="width:30%;background:">
            <table class="diminuiLabel">
                <tr><td><h1><?php echo $turma->disciplina?></h1></td></tr>
                <tr><td><?php echo form_label('Letra:'); echo $turma->letra?></td></tr>
                <tr><td><?php echo form_label('Horário:'); echo $turma->horario?></td></tr>
                <tr><td><?php echo form_label('Dias:'); echo $turma->dias?></td></tr>
                <tr><td><?php echo form_label('Semestre:'); echo $turma->semestre?></td></tr>
                <tr><td><?php echo form_label('Nº Aulas:'); echo count($aulas)?></td></tr>
                <tr><td><?php echo form_label('Nº Alunos:'); echo count($alunos)?><hr></td></tr>
                <tr><td><button class="fazer-chamada">Fazer Chamada</button></td></tr>
            </table>
        </td>
        <td style="width:70%" valign="top">
            <h1><span id="opGraf1">Status da Turma</span> / <span id="opGraf2">Faltas</span></h1>
            <div id="graf1" style="text-align: center"></div>
            <div id="graf2" style="text-align: center"></div>
        </td>
    </tr>
</table>
<br>

<h1 class="tituloTog">
    <img src="<?php echo base_url()?>public/imagens/icones/seta.png"/>
    Aulas
</h1>
<div class="esconde">
<?php if($aulas){?>    
    <table class="listagem">
        <tr>
            <th>Tema</th>
            <th>Data</th>
        </tr>
        <?php foreach ($aulas as $aula){?>
        <tr>
            <td><?php echo $aula->data?></td>
            <td><?php echo $aula->tema?></td>
            <td><?php echo anchor('turma/verAula/'.$aula->id,' ', 'class="icone pesquisar"')?></td>
            <td><a class="icone editar" id="<?php echo $aula->id?>"></a></td>
            <td><a class="icone excluir" id="<?php echo $aula->id?>"></a></td>
        </tr>
        <?php } ?>    
    </table>
<?php } else{
    echo '<h2>Não houve aulas até o momento</h2>';
}?>
</div>
    

<h1 class="tituloTog">
    <img src="<?php echo base_url()?>public/imagens/icones/seta.png"/>
    Alunos
</h1>
<?php if($alunos){ ?>
<div class="esconde">
    <table class="listagem">
        <tr>
            <th>Matrícula</th>
            <th>Nome</th>
            <th>Curso</th>
            <th>Faltas</th>
            <th>Situação</th>
        </tr>
        <?php foreach ($alunos as $aluno){?>
        <tr>
            <td><?php echo $aluno->matricula?></td>
            <td><?php echo $aluno->nome?></td>
            <td><?php echo $aluno->curso?></td>
            <td><?php echo $aluno->faltas?></td>
            <td class="situacao"><?php echo $aluno->situacao?></td>
        </tr>
        <?php } ?>
    </table>
<?php }else{
    echo '<h2>Não há alunos até o momento</h2>';
}?>    
</div>

<script>
    $(function() {
        $('.fazer-chamada').click(function() {
            $.ajax({
                url: '<?php echo base_url();?>index.php/turma/chamada/<?php echo $turma->id?>',
                type: 'POST',
                success: function(data){
                    $('.popUp2').html(data);
                    $('.popUpBack2').fadeIn(1000);
                    $(chamadaReady());
                }
            });
        });
    });
</script>

<?php $this->load->view('_inc/footer'); ?>